<template>
  <div class="index">
    <div  v-if="isshow===true">
      <layout-box :is-leave="isLeave">
        <!-- 页面左侧 -->
        <div slot="left" class="leftbox">
          <PersonnelMonitoring />
          <CarinforMation />
        </div>

        <!-- 页面右侧 -->
        <div slot="right" class="rightbox">
          <SideBar/>
          <WorkProgress/>
          <SecurityAlarm/>
        </div>
      </layout-box>
      <!-- <PersonPath
        v-if="showPersonPath"
        :total-point-count="totalPointCount"
        @close="showPersonPath = false"
      />-->
      <ResourceControl :default-resource="navRecorce" class="bottom"/>
    </div>
    <div v-else-if="isshow===false" class="time-box">
      <Time/>
    </div>
    <!-- <router-view/> -->
  </div>
</template>
<script>
import LayoutBox from '@/components/LayoutBox';

import PersonnelMonitoring from './PersonnelMonitoring.vue';
import CarinforMation from './CarinforMation.vue';
import ResourceControl from '@/components/bottom/ResourceControl';
import WorkProgress from './WorkProgress.vue';
import SecurityAlarm from './SecurityAlarm.vue';
import SideBar from './SideBar.vue';
import Time from './time/GoTime.vue';
export default {
  name: 'Index',
  components: {
    PersonnelMonitoring,
    CarinforMation,
    WorkProgress,
    SecurityAlarm,
    SideBar,

    LayoutBox,
    ResourceControl,

    Time
  },
  data() {
    return {
      // 路由跳转退场动画
      isLeave: false,
      navRecorce: ['人员']
    };
  },
  computed: {
    // ue4ToWeb() {
    //   return this.$store.state.ue4ToWeb;
    // }
    isshow() {
      return this.$store.state.dispath.isconceal;
    }
  },
  created() {
  },
  mounted() {
    // this.$nextTick(function() {
    //   this.changeview();
    // });
    console.log(this.isshow);
  },
  watch: {
    // ue4ToWeb(val) {
    //   const { socketFunName, socketParams } = val;
    //   if (socketFunName === 'GuiJiHuiFang') {
    //     // console.log('轨迹回放联动', socketFunName);
    //     this.totalPointCount = Number(socketParams.totalPointCount);
    //     this.showPersonPath = true;
    //   }
    // }
  },
  beforeRouteLeave(to, from, next) {
    this.isLeave = true;
    setTimeout(() => {
      next();
    }, 800);
  },
  methods: {
    changeview() {
      if (this.isshow === flase) {
        this.show = false;
      } else {
        this.show = true;
      }
      // this.list = localStorage.getItem('cmts');
      // this.$forceUpdate();;
    }
  }
};
</script>
<style lang="scss" scoped>
.index {
  position: relative;
}
.rightbox,.leftbox {
  height: 61.25rem;
  box-sizing: border-box;
}
.time-box{
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
</style>
